<template>
  <div class="m-contain edit edit-set">
    <van-nav-bar title="设置"
                 left-arrow
                 @click-left="onClickLeft" />
    <div class="m-main">
      <div class="clear">

        <van-cell-group title="">
          <img :src="require('@/assets/image/person/clear.png')"
               width="22"
               alt="">
          <van-cell center
                    title="清除缓存"
                    is-link
                    value="145M" />
        </van-cell-group>
      </div>
      <div class="btn">
        <van-button type="danger"
                    plain
                    round>退出</van-button>
      </div>
    </div>
  </div>
</template>
<script>

import Vue from 'vue';

import { NavBar, Field, Cell, CellGroup, Button } from 'vant';

Vue.use(Field);
Vue.use(NavBar);
Vue.use(Cell);
Vue.use(CellGroup);
Vue.use(Button);
export default {
  name: "userInfo",
  data() {
    return {
      value: ''
    }
  },
  components: {

  },
  methods: {
    onClickLeft() {
      this.$router.push('/mine')
    }
  }
}
</script>

<style lang="less">
.edit-set {
  .van-image__img {
    margin-top: 10px;
  }
  .van-cell__label {
    color: #333333;
  }
  .van-cell-group {
    display: flex;
    align-items: center;
    padding-left: 16px;
  }
  .van-button {
    width: 100%;
  }
}
</style>

<style lang="less" scoped>
.edit {
  min-height: 100vh;
  width: 100%;
  background-color: #fff;
  .van-cell {
    height: 63px;
  }
}
.btn {
  height: 46px;
  width: 82%;
  margin: 0 auto;
  margin-top: 300px;
}
</style>